import React from 'react';
import { Link } from 'react-router-dom'
import { WhiteSpace } from 'antd-mobile'
import './Message.css'
import Level from '../Level'

const Message = (props) => {
    return (
        <div className="message">
            <div className="message_panel">
                <div className="panel_top">
                    <div className="avatar"></div>
                    <div className="avatar_message">
                        <h5>{props.info ? props.info.truename : ''}</h5>
                        <WhiteSpace size="md" />
                        <p>用户编号：{props.info ? props.info.username : ''}</p>
                        <WhiteSpace size="sm" />
                        <p>注册日期：{props.info ? props.info.created_time.split(' ')[0] : ''}</p>
                    </div>
                    <div className="level" style={{ fontSize: '12px' }}>
                        <Level level={props.info ? props.info.level : ''} />
                    </div>
                    <Link className="link" to="/" >关联账号 ＞</Link>
                </div>
                <div className="panel_bottom">
                    <div className="panel_children">
                        <p>直推人数</p>
                        <WhiteSpace size="sm" />
                        <h5>{props.info ? props.info.introduce_effective_amount : ''}</h5>
                    </div>
                    <div className="panel_children">
                        <p>团队人数</p>
                        <WhiteSpace size="sm" />
                        <h5>{props.info ? props.info.introduce_effective_team_amount : ''}</h5>
                    </div>
                    <div className="panel_children">
                        <p>静态出局</p>
                        <WhiteSpace size="sm" />
                        <h5>{props.info ? (props.info.is_out === 0 ? '否' : '是') : ''}</h5>
                    </div>
                    <div className="panel_children">
                        <p>团队暂停</p>
                        <WhiteSpace size="sm" />
                        <h5>{props.info ? (props.info.is_pause === 0 ? '否' : '是') : ''}</h5>
                    </div>
                </div>
            </div>
        </div>
    );
}

export default Message;
